@charset "utf-8";
/*Menu 导航 horizontal*/
.mj-menu-horizontal {height: 60px;line-height: 60px;}
.mj-menu-horizontal {display: flex;border-bottom:1px solid var(--border-color);align-items:center;}
.mj-menu-horizontal > .mj-menu-item {cursor: pointer;padding:0 20px;position: relative;}
.mj-menu-horizontal > .mj-menu-item i {line-height: normal;}
.mj-menu-horizontal > .mj-menu-item:after {content:"";position: absolute;left:50%;bottom:-1px;display:block;width:0%;height:2px;transition: all .3s ease;}
.mj-menu-horizontal .mj-subment-dropdown {position: absolute;z-index:900;background:var(--white);box-shadow:0 1px 6px rgb(0 0 0 / 20%);border-radius:4px;padding:5px 0;line-height: normal;min-width:100px;transition: all .3s ease;display:none;margin-top:2px;}
.mj-menu-horizontal .mj-subment-dropdown:after {content:"";position: absolute;width:100%;height:100%;top:-15px;z-index:-1;}
.mj-menu-horizontal .mj-subment-dropdown .mj-submenu-drop-list {overflow-y:auto;max-height:300px;position: relative;}
.mj-menu-horizontal .mj-menu-item-active {color:var(--primary);}
.mj-menu-horizontal .mj-menu-item-active:after {background:var(--primary);left:0;width:100%;}
.mj-menu-horizontal > .mj-menu-item:hover {color:var(--primary);}
.mj-menu-horizontal > .mj-menu-item:hover:after {background:var(--primary);left:0;width:100%;} 
.mj-menu-horizontal .mj-submenu-title {cursor: pointer;position: relative;padding:0 20px;}
.mj-menu-horizontal .mj-submenu-title:after {content:"";position: absolute;left:50%;bottom:-1px;display:block;width:0%;height:2px;transition: all .3s ease;}
.mj-menu-horizontal .mj-submenu-title i {transition: all .3s;display: inline-block;font-size:13px;line-height:normal;}
.mj-menu-horizontal .mj-submenu-title.show i:last-child {transform:rotate(-180deg);}
.mj-menu-horizontal .mj-submenu-active .mj-submenu-title:after {background:var(--primary);left:0;width:100%;}
.mj-menu-horizontal .mj-subment-dropdown .mj-menu-item {padding:6px 10px;cursor: pointer;transition: all .3s ease;}
.mj-menu-horizontal .mj-subment-dropdown .mj-menu-item:hover {background:var(--gray15);}
.mj-menu-horizontal .mj-subment-dropdown .mj-menu-group-title {color:var(--gray9);padding:5px 10px;font-size:12px;}
.mj-menu-horizontal .mj-subment-dropdown.slide-down {display: block;;}
.mj-menu-horizontal .mj-subment-dropdown.slide-up {display: block;pointer-events: none;}

/* animation */
.slide-down:not([position="top"]) {
    -webkit-animation: slideDown .3s cubic-bezier(.23,1,.32,1) both; 
            animation: slideDown .3s cubic-bezier(.23,1,.32,1) both;    
}
.slide-down[position="top"] {
    -webkit-animation: slideDown2 .3s cubic-bezier(.23,1,.32,1) both; 
            animation: slideDown2 .3s cubic-bezier(.23,1,.32,1) both;        
}
.slide-up:not([position="top"]) {
    -webkit-animation: slideUp .3s cubic-bezier(.23,1,.32,1) both; 
            animation: slideUp .3s cubic-bezier(.23,1,.32,1) both;    
}
.slide-up[position="top"] {
    -webkit-animation: slideUp2 .3s cubic-bezier(.23,1,.32,1) both; 
            animation: slideUp2 .3s cubic-bezier(.23,1,.32,1) both;    
}

@-webkit-keyframes slideDown {
    0% {
        -webkit-transform: scaleY(.8) translateZ(0);
        -webkit-transform-origin: 0% 0%;
        opacity: 0;
    }
    100% {
        -webkit-transform: scaleY(1) translateZ(0);
        -webkit-transform-origin: 0% 0%;
        opacity: 1;
    }
}
@-webkit-keyframes slideDown2 {
    0% {
        -webkit-transform: scaleY(.8) translateZ(0);
        -webkit-transform-origin: 0% 100%;
        opacity: 0;
    }
    100% {
        -webkit-transform: scaleY(1) translateZ(0);
        -webkit-transform-origin: 0% 100%;
        opacity: 1;
    }
}
@-webkit-keyframes slideUp {
    0% {
        -webkit-transform: scaleY(1) translateZ(0);
        -webkit-transform-origin: 0% 0%;
        opacity: 1;
    }
    100% {
        -webkit-transform: scaleY(.8) translateZ(0);
        -webkit-transform-origin: 0% 0%;
        opacity: 0;
    }
}
@-webkit-keyframes slideUp2 {
    0% {
        -webkit-transform: scaleY(1) translateZ(0);
        -webkit-transform-origin: 0% 100%;
        opacity: 1;
    }
    100% {
        -webkit-transform: scaleY(.8) translateZ(0);
        -webkit-transform-origin: 0% 100%;
        opacity: 0;
    }
}
/*menu 导航 vertical*/
.mj-menu-vertical {position: relative;}
.mj-menu-vertical:after {content:"";position:absolute;height:100%;width:0;border-right:1px solid var(--border-color);top:0;right:0;pointer-events: none;}
.mj-menu-vertical .mj-menu-item {cursor: pointer;padding:12px 0 12px 20px;transition: all .3s ease;position: relative;z-index:2;display: flex;align-items:center;}
.mj-menu-vertical .mj-menu-item-active {color:var(--primary);}
.mj-menu-vertical .mj-menu-item:hover {color:var(--primary);}
.mj-menu-vertical .mj-menu-item-active:after {content:"";position:absolute;height:100%;width:2px;background:var(--primary);top:0;right:0;}
.mj-menu-vertical .mj-submenu-title {cursor: pointer;padding:12px 0 12px 20px;transition: all .3s ease;display: flex;align-items:center;}
.mj-menu-vertical .mj-submenu-title:hover {color:var(--primary);}
.mj-menu-vertical .mj-submenu-title i {display: inline-block;transition: all .2s;}
.mj-menu-vertical .mj-submenu-title i:last-child {transform:rotate(-90deg);font-size:13px;float:right;margin-right:10px;margin-left:auto;}
.mj-menu-vertical .mj-submenu-title.open i:last-child {transform:rotate(0deg);}
.mj-menu-vertical .mj-submenu .mj-subment-dropdown {overflow:hidden;}
.mj-menu-vertical > .mj-submenu > .mj-subment-dropdown > .mj-submenu-drop-list > .mj-menu-group > ul > li {padding-left:2em;}
.mj-menu-vertical > .mj-submenu > .mj-subment-dropdown > .mj-submenu-drop-list > .mj-menu-group .mj-submenu {padding-left:0;}
.mj-menu-vertical > .mj-submenu > .mj-subment-dropdown > .mj-submenu-drop-list > .mj-menu-group .mj-submenu .mj-submenu-title {padding-left:2em;}
.mj-menu-vertical > .mj-submenu > .mj-subment-dropdown > .mj-submenu-drop-list > .mj-menu-group .mj-submenu li {padding-left:3em;}

/*menu 导航 theme*/
.mj-menu-theme-dark {background:var(--gray5)}
.mj-menu-theme-dark >.mj-menu-item,.mj-menu-theme-dark >.mj-menu-item:hover {color:var(--white);}
.mj-menu-theme-dark .mj-menu-item:after {display: none;}
.mj-menu-theme-dark .mj-submenu-title {color:var(--white);}
.mj-menu-horizontal.mj-menu-theme-dark .mj-submenu-active .mj-submenu-title:after {display: none;}
.mj-menu-horizontal.mj-menu-theme-dark > .mj-menu-item-active {background: var(--primary);}
.mj-menu-vertical.mj-menu-theme-dark:after {border-color:var(--gray5);}
.mj-menu-vertical.mj-menu-theme-dark .mj-menu-item {color:var(--gray15);}
.mj-menu-vertical.mj-menu-theme-dark .mj-menu-item:hover,
.mj-menu-vertical.mj-menu-theme-dark .mj-submenu-title:hover {color:var(--white);}
.mj-menu-vertical.mj-menu-theme-dark .mj-menu-item-active,
.mj-menu-vertical.mj-menu-theme-dark .mj-menu-item-active:hover {background: var(--primary);color:var(--white);}